import React, { Component } from 'react'
import { Route, Switch } from 'react-router'
import { NavLink } from 'react-router-dom'
import Playlist from './Playlist'
import Toplist from './Toplist'

export default class Find extends Component {
  render() {
    return (
      <div>
        <h2>发现音乐-页面组件</h2>
        <NavLink to='/find/toplist'>排行榜</NavLink>
        <NavLink to='/find/playlist'>歌单</NavLink>
        {/* React的 Route 组件：相当于 Vue 的 <router-view> + 路由配置 */}
        <Switch>
          <Route path='/find/toplist' component={Toplist} />
          <Route path='/find/playlist' component={Playlist} />
        </Switch>
      </div>
    )
  }
}
